<?php include THEMES_PATH . 'public/before_body2.phtml';?>
<link href="/statics/front/css/measure.css" rel="stylesheet">
</head>
<body>
<div class="main-width video-box">
  <video src="/statics/front/video/<?php echo cookie('think_language');?>/intro.mp4" poster="/statics/front/images/measure/0.jpg" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' preload="auto" class="center-block">
    Your browser does not support the video tag
  </video>
</div>
<div class="align-center take-photos-controls">
  <span class="play js-play"></span>
  <span class="pause hide js-pause"></span>
  <span class="replay js-replay"></span>
  <a href="<?php echo url('measure/take_photos');?>" class="take-photos js-take-photos"></a>
</div>
<script src="/statics/front/js/plugins/html5media.js"></script>
<script>
$(function() {
  var $win = $(window),
    $video = $('video'),
    video = $video[0],
    $play = $('.js-play'),
    $pause = $('.js-pause'),
    $replay = $('.js-replay'),
    clickEvent = unifyMobileDesktop.compatibleEvent({
      mobile: 'touchend',
      desktop: 'click'
    }),
    isSupportVideo = function() {
      var video = document.createElement('video');
      return (typeof video !== 'undefined' && typeof video.canPlayType === 'function') ? true : false;
    },
    setSize = function() {
      $video.parent().css({
        'width': $win.width(),
        'height': $win.height()
      });
    };

  if (!isSupportVideo()) {
    $play.parent().addClass('hide');
    return false;
  }

  setSize();
  $win.on('load resize', function() {
    setSize();
  });

  $play.on(clickEvent, function() {
    video.play();
    $play.addClass('hide');
    $pause.removeClass('hide');
  });
  
  $pause.on(clickEvent, function() {
    video.pause();
    $pause.addClass('hide');
    $play.removeClass('hide');
  });

  $replay.on(clickEvent, function() {
    video.currentTime = 0;
    video.play();
    $play.addClass('hide');
    $pause.removeClass('hide');
  });
});
</script>
<?php include THEMES_PATH.'public/after_body.phtml';?>